<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
    <%@ taglib uri="/struts-tags" prefix="s"%>
            <%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<base href="<%=basePath%>">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title><s:text name='friendsManagement'/></title>
<link rel="stylesheet" href="view/ask/css/global.css" type="text/css" media="screen">
<link rel="stylesheet" href="view/ask/css/collection-style.css" type="text/css" media="screen">
<script type="text/javascript" src="view/ask/js/jquery-1.8.3.js"></script>
<script type="text/javascript" src="view/ask/js/Dialog.js"></script>
<script type="text/javascript">
function zOpenEle(){
	var diag = new Dialog("Diag4");
	diag.Width = 300;
	diag.Height = 100;
	diag.Title = "创建目录";
	diag.innerElementId="test";
	diag.show();
}
</script>

</head>
<body>
<div class="navigation-bar">
	<div class="personal">
	 <a href="#"><img src="view/ask/image/p1.gif" alt="" /><s:text name='manManLi'/></a>
	 <a href="#"><s:text name='myDaoEPing'/></a>
	 <a href="#"><s:text name='myCenter'/></a>
	 <br/>
	 <span ><s:text name='theTestArchitect'/></span>
	 <span ><s:text name='shangHai'/></span>
	</div>
	<div class="clear"></div>
</div>
<div class = "body-content">
 <div class="bar">
 <h3><s:text name='friendsManagement'/></h3>
 <div class="list">
   <ul>
				<li>	<a href="#" class="group">
						<s:text name='allFriends'/>
				</a>   
				<li>
				<li>	<a href="#" class="group">
						<s:text name='directoryOne'/>
				</a>   
				<li>
				<li>	<a href="#" class="group">
						<s:text name='directoryTwo'/>
				</a>   
				<li>
				<li>	<a href="#" class="group">
						<s:text name='notGroupFriends'/>
				</a>   
				<li>

   </ul>
   <input name="button2" type="button" class="add" onclick="zOpenEle()" value="<s:text name='createDirectory'/>" />
   <div class="clear"></div>
 </div>
 </div>
 <div class="management">
  <div class="top-info">
  <h4><s:text name='directoryTwo'/></h4>
   <span><s:text name='directoryTwoDescription'/></span>
   <input name="button" type="button" class="decription" value="<s:text name='editDescription'/>" />
   <input class="edit-name" type="button" value="<s:text name='editDirectory'/>">	
	 <input class="remove" type="button" value="<s:text name='deleteDirectory'/>">	
  </div>
  <div>
        <select name="move">
		<option><s:text name='addToDirectory'/></option>
		<option><s:text name='directoryOne'/></option>
		<option><s:text name='directoryTwo'/></option>
		</select>
		 <input class="cancel" type="button" value="<s:text name='cancelConcern'/>">	
 <div class="search">
	<div id="person-search">
	   <div class="person-search-box">
	   <select class="left" name="fields" >
		<option value="sh"><s:text name='shangHai'/></option>
		<option value="bg"><s:text name='beiJing'/></option>
		<option value="gz" selected="selected"><s:text name='guangZhou'/></option>
		<option value="sz"><s:text name='shenZhen'/></option>
		</select>
	   </div>
	   <div class="person-search-box right-box">
	   	<select class="right-input-box" name="fields" >
		<option value="sh"><s:text name='test'/></option>
		<option value="bg"><s:text name='testLevel1'/></option>
		<option value="gz" selected="selected"><s:text name='testLevel2'/></option>
		<option value="sz"><s:text name='test'/></option>
		</select>
	   <img src="view/ask/image/icon/search.png" alt="" />	   </div>
	   <div class="clear"></div>
	  </div> 
	  <div class="search-by-name">
	  <input type="text" value="<s:text name='testLevel1'/>" /> 
	  <img src="view/ask/image/icon/search.png" alt="" />	   </div>
	  </div>
	   <div class="clear"></div>
	</div>
  		<table>
			 <thead>
									<tr>
								      <th><input class="check-all" type="checkbox" /></th>
									   <th><s:text name='name'/></th>
									   <th><s:text name='place'/></th>
									   <th><s:text name='job'/></th>
									   <th><s:text name='concern'/>/<s:text name='cancelConcern'/></th>
									   <th><s:text name='inStationLetter'/></th>
									   <th><s:text name='joinBlacklist'/></th>
									</tr>
	
			 </thead>
	
			 <tbody>
			    <tr>
									<td><input type="checkbox" /></td>
									<td><a href="#" title="title"><s:text name='manManLi'/></a></td>
									<td>Tang</td>
									<td><s:text name='theTestArchitect'/></td>
									<td><a href="#" title="Edit"><img src="#" alt="Edit" /></a></td>
									<td><a href="#" title="Edit"><img src="#" alt="Edit" /></a></td>
									<td><a href="#" title="Edit Meta"><img src="#" alt="Edit Meta" /></a></td>
			    </tr>
				   <tr>
									<td><input type="checkbox" /></td>
									<td><a href="#" title="title"><s:text name='manManLi'/></a></td>
									<td>Tang</td>
									<td><s:text name='theTestArchitect'/></td>
									<td><a href="#" title="Edit"><img src="#" alt="Edit" /></a></td>
									<td><a href="#" title="Edit"><img src="#" alt="Edit" /></a></td>
									<td><a href="#" title="Edit Meta"><img src="#" alt="Edit Meta" /></a></td>
			    </tr>
			</tbody>
					 <tfoot>
								<tr>
								<td colspan="6">
								<div class="pagination">
											<a href="#" title="First Page">&laquo; <s:text name='firstPage'/></a>
											<a href="#" title="Previous Page">&laquo; <s:text name='previousPage'/></a>
											<a href="#" class="number" title="1">1</a>
											<a href="#" class="number" title="2">2</a>
											<a href="#" class="number current" title="3">3</a>
											<a href="#" class="number" title="4">4</a>
											<a href="#" title="Next Page"><s:text name='nextPage'/> &raquo;</a><a href="#" title="Last Page"><s:text name='lastPage'/> &raquo;</a>
							    </div> <!-- End .pagination -->
								</td>
								</tr>
			 </tfoot>					
	  </table>
								
  </div>
 
<div class="clear"> </div>
 
 
</div>

</body>
</html>
